<!DOCTYPE html	PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui" template="/template/template_layout_lrt.xhtml"
	xmlns:s="http://sduept.security.el/func">
	<ui:define name="head">
		<style>
.ui-tree {
	width: 100%;
}
</style>
	</ui:define>
	<ui:define name="top-box-tools">
		<h:form id="toolForm">
			<p:toolbar>
				<f:facet name="left">
					<p:commandButton id="createTitle" value="新建标题" style="margin-left:5px;" icon="fa fa-plus"
						rendered="#{s:hasPermission(session,'gzgl_yddsjwh_nrgl_xjbt')}"
						update="dlgForm:createDialog leftForm:titleList editorForm:editor msgs"
						oncomplete="PF('createDialog').show()" actionListener="#{htmlDocumentController.preCreate}"></p:commandButton>
					<p:commandButton value="修改标题" id="updateTitle" style="margin-left:5px;" icon="fa fa-pencil"
						rendered="#{s:hasPermission(session,'gzgl_yddsjwh_nrgl_xgbt')}"
						disabled="#{htmlDocumentController.selected==null}"
						update="dlgForm1:updateDialog leftForm:titleList editorForm:editor msgs"
						oncomplete="PF('updateDialog').show()"></p:commandButton>
					<p:commandButton value="删除标题" icon="fa fa-trash"
						rendered="#{s:hasPermission(session,'gzgl_yddsjwh_nrgl_scbt')}"
						disabled="#{htmlDocumentController.selected==null}"
						update="leftForm:titleList editorForm msgs" style="margin-left:5px;"
						actionListener="#{htmlDocumentController.deleteTitle}">
						<p:confirm header="提示" message="删除该标题后会一并删除内容，确定删除吗?" icon="ui-icon-alert" />
					</p:commandButton>

				</f:facet>
			</p:toolbar>
			<p:confirmDialog global="true" showEffect="fade" hideEffect="fade">
				<p:commandButton value="是" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
				<p:commandButton value="否" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close" />
			</p:confirmDialog>
			<p:growl id="msgs" showDetail="true" />
		</h:form>
	</ui:define>
	<ui:define name="left-box-title">
		标题列表
	</ui:define>
	<ui:define name="left-box-body">
		<h:form id="leftForm">
			<p:tree id="titleList" value="#{htmlDocumentController.root}" var="node"
				selection="#{htmlDocumentController.selectedNode}" selectionMode="single">
				<p:ajax event="select" listener="#{htmlDocumentController.onNodeSelect}"
					update=" toolForm editorForm" oncomplete="resizeEditor()" />
				<p:treeNode type="HtmlDocument">
					<h:outputText value="#{node.title}" />
				</p:treeNode>
			</p:tree>
		</h:form>
	</ui:define>
	<ui:define name="right-box-title">
		内容
	</ui:define>
	<ui:define name="right-box-body">
		<h:form id="editorForm">
			<p:commandButton value="保存内容" update="toolForm:msgs" icon="ui-icon-disk"
				rendered="#{s:hasPermission(session,'gzgl_yddsjwh_nrgl_bcnr')}"
				disabled="#{htmlDocumentController.selected==null}"
				actionListener="#{htmlDocumentController.saveText}" />
			<p:textEditor id="editor" value="#{htmlDocumentController.text}" style="margin-bottom:10px" />
		</h:form>
		<h:form id="dlgForm">
			<p:dialog header="新建标题" height="200" width="300" modal="true" widgetVar="createDialog"
				resizable="false" dynamic="true" showEffect="explode" hideEffect="fold" id="createDialog">
				<p:toolbar>
					<f:facet name="left">
						<p:commandButton value="保存" icon="ui-icon-disk"
							update="leftForm:titleList toolForm createDialog editorForm"
							oncomplete="PF('createDialog').hide()" actionListener="#{htmlDocumentController.createTitle}" />
						<p:commandButton icon="ui-icon-cancel" type="button" value="关闭"
							onclick="PF('createDialog').hide()" />
					</f:facet>
				</p:toolbar>
				<p:inputText placeholder="请输入标题" value="#{htmlDocumentController.create.title}"
					style="width:100%;margin:10px 0px" required="true" requiredMessage="标题不能为空！"></p:inputText>
			</p:dialog>
		</h:form>
		<h:form id="dlgForm1">
			<p:dialog header="修改标题" height="200" width="300" modal="true" widgetVar="updateDialog"
				id="updateDialog" resizable="false" dynamic="true" showEffect="explode" hideEffect="fold">
				<p:toolbar>
					<f:facet name="left">
						<p:commandButton value="保存" icon="ui-icon-disk"
							update="leftForm:titleList toolForm:msgs updateDialog editorForm:editor "
							oncomplete="PF('updateDialog').hide()" actionListener="#{htmlDocumentController.updateTitle}" />
						<p:commandButton icon="ui-icon-cancel" type="button" value="关闭"
							onclick="PF('updateDialog').hide()" />
					</f:facet>
				</p:toolbar>
				<p:inputText value="#{htmlDocumentController.selected.title}" style="width:100%;margin:10px 0px"></p:inputText>
			</p:dialog>
		</h:form>
	</ui:define>
	<ui:define name="contentend">
		<script>
			var centerH = 500;
			$(function() {
				centerH = $("#center").height() - 200;
			});
			function resizeEditor() {
				document.getElementById("editorForm:editor_editor").style.height = centerH
						+ "px";
			}
		</script>
	</ui:define>
</ui:composition>